import React from 'react'
import { Form, Input, Modal, Button, Select, message} from 'antd'
import PropTypes from 'prop-types'
import './manager.less'
import API from "../../api/person/person";
const FormItem = Form.Item
// const Search = Input.Search
const Option = Select.Option

// const Search = Input.Search

class IcsComponentsSupplierFilterForm extends React.Component {
    state = {
        job_status:[
            {value:1, name: '试用'},
            {value:10, name: '在职'},
            {value:20, name: '离职'}
        ],
        correct: false
    }
    componentDidMount () {

    }
    componentWillReceiveProps (nextProps) {
        if ('rowInfo' in nextProps) {
            this.setState({ rowInfo: nextProps.rowInfo})
        }
    }
    onCancel = () => {
        this.props.doViewer()
    }
    handleSearch = (e) => {
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (err) return
            if (this.props.isEditing) {
                values.user_id = this.state.rowInfo.user_id
            }
            API.doManager(values).then(res => {
                if (res.error === 0) {
                    message.success('操作成功！')
                    this.props.doViewer()
                    this.props.doSearch()
                } else {
                    message.error(res.msg || '操作失败！')
                }
            })
        });
    }
    checkData = (values) => {

    }

    render () {
        const { getFieldDecorator } = this.props.form
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 5 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 17 },
            },
        }
        return this.props.showViewer && <Modal
            className="store-viewer"
            style={{width: 600}}
            visible={this.props.showViewer}
            title={this.props.isEditing ? "编辑管理员" : '新建管理员'}
            onCancel={this.onCancel}
        >
            <Form
                layout="inline"
                className="supplier-filter"
                onSubmit={this.handleSearch}>
                <FormItem
                    {...formItemLayout}
                    label="姓名">
                    {getFieldDecorator('real_name', {
                        rules: [{
                            required: true, message: '请输入姓名!',
                        }],
                        initialValue: this.state.rowInfo? this.state.rowInfo.real_name : ''
                    })(
                        <Input />
                    )}
                </FormItem>
                <FormItem
                    {...formItemLayout}
                    label="账号">
                    {getFieldDecorator('user_name', {
                        rules: [{
                            required: true, message: '请输入账号！'
                        }],
                        initialValue: this.state.rowInfo? this.state.rowInfo.user_name : ''
                    })(
                        <Input />
                    )}
                </FormItem>
                <FormItem
                    {...formItemLayout}
                    label="联系电话">
                    {getFieldDecorator('user_tel', {
                        rules: [{
                            required: true, message: '请输入联系电话',
                        }],
                        initialValue: this.state.rowInfo? this.state.rowInfo.user_tel : ''
                    })(
                        <Input />
                    )}
                </FormItem>
                <FormItem
                    {...formItemLayout}
                    label="在职状态">
                    {getFieldDecorator('job_status', {
                        rules: [{
                            required: true, message: '请选择在职状态!',
                        }],
                        initialValue: this.state.rowInfo? parseInt(this.state.rowInfo.job_status, 10) : ''
                    })(
                        <Select style={{ width: 194 }} placeholder="在职状态">
                            {this.state.job_status.map(v =>  <Option key={v.value} value={v.value}>{v.name}</Option>)}
                        </Select>
                    )}
                </FormItem>

                <div className="btns">
                    <Button type="primary" style={{marginRight: 10}} onClick={this.onCancel}>取消</Button>
                    <Button type="primary" htmlType="submit">提交</Button>

                </div>
            </Form>
        </Modal>
    }
}

IcsComponentsSupplierFilterForm.propTypes = {
    getFieldDecorator: PropTypes.func,
    doSearch: PropTypes.func,
    doViewer: PropTypes.func,
    showViewer: PropTypes.any,
    isEditing: PropTypes.bool,
    rowInfo: PropTypes.object,
    form: PropTypes.object
}

const IcsComponentsSupplierFilter = Form.create()(IcsComponentsSupplierFilterForm)

export default IcsComponentsSupplierFilter
